<template>
  <!-- 申请弹框 -->
  <el-dialog class="apply_dialog"
  :visible.sync="visible" :title="mystage"
  :close-on-click-modal="false" 
  @close="cancel"
  :close-on-press-escape="false"
  :append-to-body="true"
  style="overflow: hidden;">
  <el-button @click="open" type="primary">开启申请</el-button>
  <!-- 团员 -> 入党积极分子 -->
    <div v-if="shenfen=='团员'" class="update_application">
      <!-- <h3>上传入党申请书</h3> -->
      <el-upload
      class="upload-demo"
      ref="removeparty"
      :on-change="uploadApp"
      drag action="#" multiple
      :auto-upload="false" accept=".png">
        <i class="el-icon-upload"></i>
        <p style="font-weight: 700;color:#f00;">上传入党申请书</p>
        <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
        <div class="el-upload__tip" slot="tip">只能上传png文件，且不超过500kb</div>
      </el-upload>
    </div>
    <!-- 入党积极分子->发展对象 -->
    <div v-if="shenfen=='入党积极分子'">
      <el-upload
      class="upload-demo"
      :on-change="uploadRecord"
      ref="removeRecord"
      drag action="#"  multiple
      :auto-upload="false" accept=".png">
        <i class="el-icon-upload"></i>
        <p style="font-weight: 700;color:#f00;">上传培训证明</p>
        <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
        <div class="el-upload__tip" slot="tip">只能上传png文件，且不超过500kb</div>
      </el-upload>
    </div>
    <!-- 发展对象->预备党员 -->
    <div class="development_target" v-if="shenfen=='发展对象'">
      <!-- 上传品德证明 -->
      <el-upload
      class="upload_morality"
      :on-change="deveTarget"
      ref="removeTarget"
      drag action="#"  multiple
      :auto-upload="false" accept=".png">
        <i class="el-icon-upload"></i>
        <p style="font-weight: 700;color:#f00;">上传品德证明</p>
        <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
        <div class="el-upload__tip" slot="tip">只能上传png文件，且不超过500kb</div>
      </el-upload>
      <!-- 上传入党志愿书 -->
      <div class="application_form">
        <!-- <input type="file" accept=".xls,.xlsx" @change="importData"> -->
        <el-upload 
        class="upload"
        action="#"
        ref="removeApplication"
        :show-file-list="false"
        :on-change="handleExcel"
        accept="'.doc','.docx'"
        :auto-upload="false"
        :headers="headers">
         <!-- <input type="file" accept=".xls,.xlsx" @change="importData"> -->
          <el-button>上传入党志愿书</el-button>
          <span v-if="application !=[]">{{application.name}}</span>
          <!-- <input type="file" @change="onChange" class="file-ipt" /> -->
        </el-upload>
      </div>
    </div>
    <!-- 预备党员->正式党员 -->
    <div v-if="shenfen=='预备党员'"></div>
    <div class="application_button">
      <el-button @click="application_submit" type="primary">提交申请</el-button>
      <el-button @click="cancel">取消</el-button>
    </div>
  </el-dialog>
</template>

<script>
export default {
  data(){
    return{
      visible:false,
      myinfomation:"",//个人信息
      mystage:"",//下一阶段
      shenfen:"",//用户身份
      membership:"",//入党申请书
      Training:"",//培训证明
      targetMorality:"",//品德证明
      application:"",//入党志愿书
      tableData:[],
      headers: {"Content-Type": "multipart/form-data;charset=UTF-8"},
    }
  },
  mounted(){},
  methods:{
    init (e) {
      // console.log(e)
      this.shenfen=e.politics
      this.visible = true
      this.$nextTick(() => {
      })
      this.myinfomation = e
      if(e.politics=="团员"){
        this.mystage = "申请成为入党积极分子"
      }else if(e.politics=="入党积极分子"){
        this.mystage = "申请成为发展对象"
      }else if(e.politics=="发展对象"){
        this.mystage = "申请成为预备党员"
      }else if(e.politics=="预备党员"){
        this.mystage = "申请成为正式党员"
      }
    },
    open(){//开启申请
      if(this.shenfen=="团员"){//团员请求接口
        this.axios({
          headers:{'Authentication':localStorage.getItem('token')},
          method:"get",
          // url:"api/application/startMemberApplication",
          url:"/application/startMemberApplication"
        }).then(res=>{
          // console.log(res)
          if(res.data.code != 20001){
            return this.$message.error(res.data.msg)
          }
           this.$message({
            message: '成功开启申请，请上传入党申请书！',
            type: 'success'
          });
        })
      }else if(this.shenfen=="入党积极分子"){
        this.axios({
          headers:{'Authentication':localStorage.getItem('token')},
          method:"get",
          // url:"api/application/startActivityApplication"
          url:"/application/startActivityApplication"
        }).then(res=>{
          // console.log(res)
          if(res.data.code != 20001){
            return this.$message.error(res.data.msg)
          }
           this.$message({
            message: '成功开启申请，请上传入党积极分子申请培训证明！',
            type: 'success'
          });
        })
      }else if(this.shenfen=="发展对象"){
        this.axios({
          headers:{'Authentication':localStorage.getItem('token')},
          method:"get",
          // url:"api/application/startDevelopApplication"
          url:"/application/startDevelopApplication"
        }).then(res=>{
          // console.log(res)
          if(res.data.code != 20001){
            return this.$message.error(res.data.msg)
          }
           this.$message({
            message: '成功开启申请，请上传入党志愿书及品德证明！',
            type: 'success'
          });
        })
      }else if(this.shenfen=="预备党员"){
        this.axios({
          headers:{'Authentication':localStorage.getItem('token')},
          method:"get",
          // url:"api/application/startReadyApplication",
          url:"/application/startReadyApplication"
        }).then(res=>{
          if(res.data.code != 20001){
            return this.$message.error(res.data.msg)
          }
           this.$message({
            message: '成功开启申请！',
            type: 'success'
          });
        })
      }
    },
    uploadApp(file,fileList){//团员->入党积极分子上传入党申请书
      this.membership = file
    },
    uploadRecord(file,fileList){//入党积极分子->发展对象上传培训证明
      this.Training = file
    },
    deveTarget(file,fileList){//发展对象->预备党员上传品德证明
      this.targetMorality = file
      // console.log(file)
    },
    application_submit(){//提交
      if(this.shenfen=="团员"){
        // console.log("团员")
        let filetuanyuan = new FormData()
        filetuanyuan.append("applyForm",this.membership.raw)
        this.axios({
          headers:{'Authentication':localStorage.getItem('token')},
          method:"post",
          // url:"api/application/clientMemberApplicationResource",
          url:"/application/clientMemberApplicationResource",
          data:filetuanyuan
        }).then(res=>{
          if(res.data.code != 20001){
            return this.$message.error(res.data.msg)
          }
          this.$emit("flowPath")
          this.$alert('提交成功，等待管理员审批',{
            confirmButtonText:'确定',
            callback:action=>{
            this.$emit("flowPath")
              this.$refs.removeparty.clearFiles()//清空上传的入党申请书
              this.visible = false
              
            }
          })
        })
      }else if(this.shenfen=="入党积极分子"){
        // console.log("入党积极分子")
        var filefenzi = new FormData()
        filefenzi.append("trainRecord",this.Training.raw)
        this.axios({
          headers:{'Authentication':localStorage.getItem('token')},
          method:"post",
          url:"/application/clientActivityApplicationResource",
          data:filefenzi
        }).then(res=>{
          if(res.data.code != 20001){
            return this.$message.error(res.data.msg)
          }
          this.$emit("flowPath")
          this.$alert('提交成功，等待管理员审批',{
            confirmButtonText:'确定',
            callback:action=>{
            this.visible = false
            this.$refs.removeRecord.clearFiles()//清空上传的培训证明
            }
          })
        })
      }else if(this.shenfen=="发展对象"){
        // console.log("发展对象")
        var fileMorality = new FormData()//入党志愿书
        var filetarget = new FormData()//品德证明
        console.log(this.application.raw)//partyApplicationAttachment
        fileMorality.append("partyApplicationAttachment",this.application.raw)//入党志愿书
        fileMorality.append("referenceCheck",this.targetMorality.raw)//品德证明
        this.axios({
          headers:{'Authentication':localStorage.getItem('token')},
          method:"post",
          // url:"api/application/clientDevelopApplicationResource",
          url:"/application/clientDevelopApplicationResource",
          data:fileMorality
        }).then(res=>{
          if(res.data.code != 20001){
            return this.$message.error(res.data.msg)
          }
          this.$emit("flowPath")
          this.$alert('提交成功，等待管理员审批',{
            confirmButtonText:'确定',
            callback:action=>{
            this.visible = false
            // this.$refs.removeApplication.clearFiles()//清空上传的入党志愿书
            // this.$refs.removeTarget.clearFiles()//清空上传的品德证明
            }
          })
        })
      }
    },
    cancel(){
      this.visible = false
      if(this.shenfen=="团员"){
        this.$refs.removeparty.clearFiles()//清空上传的入党申请书
      }else if(this.shenfen=="入党积极分子"){
        this.$refs.removeRecord.clearFiles()//清空上传的培训证明
      }else if(this.shenfen=="发展对象"){
        this.$refs.removeApplication.clearFiles()//清空上传的入党志愿书
        this.application = ""
        this.$refs.removeTarget.clearFiles()//清空上传的品德证明
      }
      // this.$refs.removeparty.clearFiles()//清空上传的入党申请书
      // this.$refs.removeRecord.clearFiles()//清空上传的培训证明
      // console.log(this.$refs.removeTarget)
      // this.$refs.removeTarget.clearFiles()//清空上传的品德证明
      // this.$refs.removeApplication.clearFiles()//清空上传的入党志愿书
    },
    handleExcel(file){//导入表格
        // console.log(file)
        this.application = file
        const files = { 0: file };
        this.readExcel(files)
      },
    readExcel(file) {//提取表格中的内容
      const fileReader = new FileReader();
      fileReader.onload = ev => {
        try {
          // console.log(ev)
          const data = ev.target.result;
          const workbook = read(data, { type: "binary" });
          const params = [];
          // 取对应表生成json表格内容
          workbook.SheetNames.forEach(item => {
            this.tableData.push(utils.sheet_to_json(workbook.Sheets[item]));
          });
          // 该算法仅针对表头无合并的情况
          if (this.tableData.length > 0) {
            // 获取excel中第一个表格数据tableData[0][0]，并且将表头提取出来
            for (const key in this.tableData[0][0]) {
              this.tableHead.push(key);
            }
          }
          // 重写数据
        } catch (e) {
          // console.log("error:" + e);
          return false;
        }
      };
      fileReader.readAsBinaryString(file[0].raw);
    },
  }
}
</script>

<style lang="scss">
.apply_dialog{
  // height: ;
  // border: 1px solid #f00;
  .update_application{
    // border: 1px solid #000;
    .el-upload-dragger{
      height: 30vh;
    }
  }
  .development_target{
    .application_form{
      border: dashed 1px #ccc;
      border-radius: 10px;
      width: 45%;
      position: absolute;
      top: 24vh;
      left: 25vw;
      text-align: center;
      height: 24vh;
      line-height: 24vh;
      // line-height: 40vh;
    }
  }
  .upload-demo{
    text-align: center;
    margin-top: 7vh;
  }
  .el-dialog{
    height: 76vh;
    // border: 1px solid #000;
  }
  .upload_morality{
    margin-top: 7vh;
    // position: absolute;
    .el-upload-dragger{
      width: 300px;
    }
  }
  .application_button{
    width: 100%;
    position: absolute;
    bottom: 3vh;
    text-align: center;
    left: 0;
  }
}

</style>